<!DOCTYPE html>
<html>

	<head>

		<meta name="viewport" content="width=device-width,initial-scale=1.0" >
		<meta charset="utf-8">
		<meta name="title" content="Bootstrap自学">
		<link href="https://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
		<script src="https://cdn.static.runoob.com/libs/jquery/2.0.0/jquery.min.js"></script>
		<script src="https://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
	</head>

	<body>
		<div class="container">
			<h1>
				hello world!
			</h1>
			<div class="row clearfix">
				<div class="col-md-4 column" style="background-color: #449D44;box-shadow: 
         inset 1px -1px 1px #444, inset -1px 1px 1px #444;">
					<h1>
						test1
					</h1>
					<!--横线-->
					<hr />
					<h1>
						test11
					</h1>
			</div>
			<div class="col-md-4 column" style="background-color: #2B542C;;box-shadow: 
         inset 1px -1px 1px #444, inset -1px 1px 1px #444;">
				<h2>
						test2test2test2test2test2test2
					</h2>
		</div>

		<div class="col-md-4 column" style="background-color: #A94442;">
			<h3>
						test3
					</h3>
		</div>

		</div>

		</div>
	</body>

</html>